import React, { useEffect, useState } from 'react';
import styles from './index.less';
import TabBar from '../components/tabBar';
import 'swiper/swiper-bundle.css';
import { useDispatch, useSelector, useLocation } from 'dva';
import Login from '../components/login/login';
import NewModal from '../components/newModal';
import { getLocale, useIntl, setLocale } from 'umi';
// import vConsole from 'vconsole'

function Index({ children }) {
  const dispatch = useDispatch();
  const { loginModalShow } = useSelector(({ index }) => index);
  // console.log(loginModalShow, 'loginModalShow')
  const location = useLocation();
  console.log(location);
  const localVisible = location.pathname.indexOf('business-match') == -1;

  useEffect(() => {
    dispatch({
      type: 'index/apiGetUserSelf',
    });
  }, []);
  function onClose() {
    dispatch({
      type: 'index/setState',
      payload: {
        loginModalShow: false,
      },
    });
  }
  return (
    <div className={styles.layout}>
      <div className={styles.content}>{children}</div>
      <TabBar />
      <NewModal
        showModal={loginModalShow}
        // onClose={onClose}
      >
        <Login></Login>
      </NewModal>
      {localVisible && (
        <div
          className={styles.local}
          onClick={() => {
            getLocale() == 'zh-CN' ? setLocale('en-US', false) : setLocale('zh-CN', false);
          }}
        >
          <img
            src={
              getLocale() == 'zh-CN'
                ? require('../assets/icon/中文.png')
                : require('../assets/icon/英文.png')
            }
          />
        </div>
      )}
    </div>
  );
}

export default Index;
